<template>
	<view class="smart=page">
		<view class="smart-page-head">
			<view class="smart-page-head-title">video视频</view>
		</view>
		<view>
			<video id="myVideo" src="../../../static/video/shipin.mp4"
			danmu-btn="true" enable-danmu="true":danmu-list="video_danmu_list"></video>
		</view>
		<view class="input_box">
			<input placeholder="评论内容..." v-model="inputValue">
		</view>
		<view class="btn_box">
			<button type="primary" @click="sendMsg">发送弹幕</button>
		</view>
	</view>
</template>
<script>
export default {
  data() {
    return {
      inputValue: '', //输入框
      videoContext: '', //视频文字
      video_danmu_list: [{
        text: '你好',
        time: 1,
        color: '#abc342'
      }, {
        text: '我很好，你好吗？',
        time: 2,
        color: '#ff5500'
      }, {
        text: '我也很好！',
        time: 3,
        color: '#0000ff'
      }]
    }
  },
  onReady: function(){
    this.videoContext= uni.createVideoContext('myVideo');
  },
  methods: {
    /*发送弹幕*/
    sendMsg(){
      console.log('弹幕内容: '+this.inputValue);
      this.videoContext.sendDanmu({
        text:this.inputValue,
        color:'red'
      })
    }
  }
}
</script>

<style>
.input_box{background-color: #CCC9CA;}
.btn_box{margin-top: 20upx;}
</style>
